<template>
    <el-dialog
      class="eldialog"
      :visible.sync="visible"
      :title="title"
      :close-on-click-modal="false"
      append-to-body
      top="2vh"
      width="98%"
      :close-on-press-escape="false"
    >
      <div class="button">
        <el-button
          type="primary"
          plain
          icon="el-icon-download"
          @click="essential"
          style="float: right; margin: -10px 0 10px 0"
          >穿梭框基本信息</el-button
        >&emsp;
        <!-- <el-button
          type="primary"
          plain
          icon="el-icon-download"
          @click="download"
          style="float: right; margin: -10px 0 10px 0"
          >下载当前页</el-button
        >&emsp; -->
        <el-button
          type="primary"
          plain
          icon="el-icon-download"
          @click="downloadAll"
          style="float: right; margin: -10px 10px 10px 0"
          >下载全部</el-button
        >
      </div>
      <vxe-table
        ref="mytable"
        :height="heightY"
        :data="articlesData"
        style="width: 100%; margin-bottom: 10px"
        border
        stripe
        highlight-current-row
        v-loading="loading"
      >
        <vxe-column
          field="xingming"
          fixed="left"
          title="姓名"
          width="80"
          align="center"
          sortable
        />
        <vxe-column field="xingbie" title="性别" align="center" width="60">
        </vxe-column>
  
        <vxe-column field="minzu_mc" title="民族" align="center" width="80" />
        <vxe-column
          field="zhiwu_jiancheng"
          title="工作单位及职务"
          align="center"
          width="240"
        />
        <vxe-column field="csny" title="出生年月" width="120" align="center" />
        <vxe-column
          field="rudangxinxi"
          title="入党时间"
          align="center"
          width="180"
        />
  
        <vxe-column
          field="qrzxl_zg"
          title="全日制学历"
          width="160"
          align="center"
        />
        <vxe-column
          field="qrzxlxx_zg"
          title="毕业院校"
          width="160"
          align="center"
        />
        <vxe-column
          field="qrzxw_zg"
          title="全日制学位"
          width="160"
          align="center"
        />
        <vxe-column field="qrzxwxx_zg" title="专业" width="160" align="center" />
        <vxe-column field="zzxl_zg" title="在职学历" width="160" align="center" />
        <vxe-column
          field="zzxlxx_zg"
          title="毕业院校"
          width="160"
          align="center"
        />
        <vxe-column field="zzxw_zg" title="在职学位" width="160" align="center" />
        <vxe-column field="zzxwxx_zg" title="专业" width="160" align="center" />
  
        <vxe-column
          field="cjgzsj"
          title="参加工作时间"
          width="120"
          align="center"
        />
        <vxe-column field="zw_sj" title="任现职时间" width="120" align="center" />
        <vxe-column
          field="zjcc_sj"
          align="center"
          title="任现职级时间"
          width="120"
        />
      </vxe-table>
      <div class="row" style="background: #fff">
        <div class="col-sm text-sm-left text-left3 pt-3">
          <vxe-pager
            background
            align="left"
            :current-page.sync="currentPage"
            :page-size.sync="perPage"
            :total="totalItems"
            :layouts="[
              'PrevJump',
              'PrevPage',
              'JumpNumber',
              'NextPage',
              'NextJump',
              'Sizes',
              'FullJump',
              'Total',
            ]"
            @page-change="handleSizeChange"
          >
          </vxe-pager>
        </div>
      </div>
      <rmb-add v-if="showRMB" ref="rmb" @cardreTypeList="init" />
      <essential v-if="essentialDialog" ref="essentialRef"></essential>
      <div />
    </el-dialog>
  </template>
    
  <script>
  import rmb from "@/views/young/datacollect/rmbInfo/rmb";
  import { exportExeclForPerson } from "@/api/young/echarts/cadre/cadre";
  import essential from "@/views/young/datacollect/rmbInfo/essential";
  import { getSzbzpbyjPersonList,getRemindPerson } from "@/api/young/echarts/cadre/cadreNew";
  export default {
    name: "detailList",
    components: {
      "rmb-add": rmb,
      essential: essential,
    },
    data() {
      // eslint-disable-next-line no-return-assign
      return {
        title: "干部类型统计",
        visible: true,
        showPersonOut: false,
        showRMB: false,
        alertPar: "", // 类型
        loading: false,
        cardreList: [],
        articlesData: [],
        // 分页
        searchKeys: ["getintoId", "roleName"],
        totalItems: 0,
        currentPage: 1,
        perPage: 10,
        heightY: window.innerHeight - 220 + "px",
        itemList: [], // 权限字段
        paramsList: [], // 条件
        alertPar: "", // 标题
        downloadAllData: [], // 下载全部的数据
        essentialDialog: false, //穿梭框的开关
        paramData:[],
        alertParList:"",
      };
    },
    mounted() {
      //this.init()
    },
  
    methods: {
      async init(param, alertPar) {
        this.paramData = param;
        this.alertParList = alertPar;
        var that = this;
        that.totalItems = 0;
        (that.articlesData = []), (that.loading = true);
        if (that.visible == false) {
          that.currentPage = 1;
        }
        that.visible = true;
        that.paramsList = param;
        that.alertPar = alertPar;
        if (param.all != "true") {
          param["page"] = that.currentPage; // 页号
          param["rows"] = that.perPage; // 条数
        } else {
          delete param.page;
          delete param.rows;
        }
        if (that.paramsList.showType == "getSzbzpbyjPersonList") {
          that.loading = true;
          getSzbzpbyjPersonList(param).then(function (result) {
            if (result.result) {
              if (param.all != "true") {
                that.totalItems = result.resultdata.count;
                that.articlesData = result.resultdata.data;
              } else {
                const params = {
                  personList: result.resultdata.data,
                  fileName: that.alertPar + " - 人员统计表.xlsx",
                };
                exportExeclForPerson(params).then(function (result) {});
              }
            }
            that.loading = false;
          });
        }else if(that.paramsList.showType =='rxcb'){
              getRemindPerson(param).then(function(result) {
                  if (result.result) {
                      if(param.all != 'true') {
                          that.totalItems = result.resultdata.count
                          that.articlesData = result.resultdata.data
                      }else {
                          const params = {
                              'personList': result.resultdata.data,
                              'fileName': that.alertPar + ' - 人员统计表.xlsx'
                          }
                          exportExeclForPerson(params).then(function (result) {
                          })
                      }
                  }
                  that.loading = false
              })
          }
        this.$nextTick(() => {
          this.$refs.mytable.recalculate();
        });
      },
      // 穿梭框基本信息
      essential() {
        this.essentialDialog = true;
        this.$nextTick(() => {
          this.$refs.essentialRef.init(this.paramData,this.alertParList);
        });
      },
      handleSizeChange({ currentPage, pageSize }) {
        this.currentPage = currentPage;
        this.perPage = pageSize;
        this.init(this.paramsList, this.alertPar);
      },
      // download() {
      //   const params = {
      //     personList: this.articlesData,
      //     fileName: this.alertPar + " - 人员统计表.xlsx",
      //   };
      //   exportExeclForPerson(params).then(function (result) {});
      // },
      downloadAll() {
        this.paramsList["all"] = "true";
        this.init(this.paramsList, this.alertPar);
      },
    },
  };
  </script>
    
  <style scoped>
  .customRoot-icon {
    width: 20px;
    height: 16px;
    display: inline-block;
    /* background: url("../../../assets/images/young/customRoot.png"); */
  }
  
  .customParent-icon {
    width: 20px;
    height: 20px;
    display: inline-block;
    /* background: url("../../../assets/images/young/customParent.png"); */
  }
  
  .customChildren-icon {
    width: 20px;
    height: 18px;
    display: inline-block;
    /* background: url("../../../assets/images/young/customChildren.png"); */
  }
  .button {
    display: flex;
    justify-content: flex-end;
  }
  </style>
    